<template>
  <a-card hoverable class="cover" size="small">
    <template #cover>
      <a-image :src="filelink" />
    </template>
    <a-card-meta class="meta" size="small">
      <template #description>
        <span>默认相册</span>
        <br />
        <a-tag color="pink">日常</a-tag>
      </template>
    </a-card-meta>

    <!-- <template #actions>
      <setting-outlined key="setting" />
      <edit-outlined key="edit" />
      <ellipsis-outlined key="ellipsis" />
    </template> -->
  </a-card>
</template>

<style scoped lang="less">
.cover {
  width: 280px;
}

.meta {
  text-align: left;
}
</style>

<script lang="ts">

// import {
//   SettingOutlined,
//   EditOutlined,
//   EllipsisOutlined
// } from '@ant-design/icons-vue';
import { computed, defineComponent, watch } from 'vue';
export default defineComponent({
  components: {

    // SettingOutlined,
    // EditOutlined,
    // EllipsisOutlined
  },
  props: ['filelink'],
  data() {
    return {
      value: ''
    };
  },
  setup(props) {
    watch(
      () => props.filelink,
      (newVal) => {
        console.log(newVal);
      }
    );

    const src = computed(() => {
      console.log(props.filelink);
      return props.filelink;
    });

    return {
      src
    };
  },
  created() {},
  computed: {
    val() {
      return this.filelink;
    }
  }
});
</script>
